fix Web/API/ValidityState (#3494)

- set \<code> elements to literals
- correct a link

Author: mfuji09

files/en-us/web/api/validitystate/index.html

@@ -14,42 +14,44 @@
 
 <h2 id="Properties">Properties</h2>
 
-<p>For each of these Boolean properties, a value of <code>true</code> indicates that the specified reason validation may have failed is true, with the exception of the <strong>valid</strong> property, which is <code>true</code> if the element's value obeys all constraints.</p>
+<p>For each of these Boolean properties, a value of <code>true</code> indicates that the specified reason validation may have failed is true, with the exception of the <code>valid</code> property, which is <code>true</code> if the element's value obeys all constraints.</p>
 
 <dl>
  <dt>{{domxref("ValidityState.badInput", "badInput")}} {{ReadOnlyInline}}</dt>
  <dd>A {{jsxref("Boolean")}} that is <code>true</code> if the user has provided input that the browser is unable to convert.</dd>
  <dt><code>customError</code> {{ReadOnlyInline}}</dt>
  <dd>A {{jsxref("Boolean")}} indicating whether the element's custom validity message has been set to a non-empty string by calling the element's {{domxref('HTMLObjectElement.setCustomValidity', 'setCustomValidity()')}} method.</dd>
  <dt>{{domxref("ValidityState.patternMismatch", "patternMismatch")}} {{ReadOnlyInline}}</dt>
- <dd>A {{jsxref("Boolean")}} that is <code>true</code> if the value does not match the specified {{htmlattrxref("pattern", "input")}}, and <code>false</code> if it does match. If true, the element matches the {{cssxref(":invalid")}} CSS pseudo-class.</dd>
+ <dd>A {{jsxref("Boolean")}} that is <code>true</code> if the value does not match the specified {{htmlattrxref("pattern", "input")}}, and <code>false</code> if it does match. If <code>true</code>, the element matches the {{cssxref(":invalid")}} CSS pseudo-class.</dd>
  <dt>{{domxref("ValidityState.rangeOverflow", "rangeOverflow")}} {{ReadOnlyInline}}</dt>
- <dd>A {{jsxref("Boolean")}} that is true if the value is greater than the maximum specified by the {{htmlattrxref("max", "input")}} attribute, or <code>false</code> if it is less than or equal to the maximum. If true, the element matches the {{cssxref(":invalid")}} and {{cssxref(":out-of-range")}} and CSS pseudo-classes.</dd>
+ <dd>A {{jsxref("Boolean")}} that is <code>true</code> if the value is greater than the maximum specified by the {{htmlattrxref("max", "input")}} attribute, or <code>false</code> if it is less than or equal to the maximum. If <code>true</code>, the element matches the {{cssxref(":invalid")}} and {{cssxref(":out-of-range")}} and CSS pseudo-classes.</dd>
  <dt>{{domxref("ValidityState.rangeUnderflow", "rangeUnderflow")}} {{ReadOnlyInline}}</dt>
- <dd>A {{jsxref("Boolean")}} that is <code>true</code> if the value is less than the minimum specified by the {{htmlattrxref("min", "input")}} attribute, or <code>false</code> if it is greater than or equal to the minimum. If true, the element matches the {{cssxref(":invalid")}} and {{cssxref(":out-of-range")}} CSS pseudo-classes.</dd>
+ <dd>A {{jsxref("Boolean")}} that is <code>true</code> if the value is less than the minimum specified by the {{htmlattrxref("min", "input")}} attribute, or <code>false</code> if it is greater than or equal to the minimum. If <code>true</code>, the element matches the {{cssxref(":invalid")}} and {{cssxref(":out-of-range")}} CSS pseudo-classes.</dd>
  <dt>{{domxref("ValidityState.stepMismatch", "stepMismatch")}} {{ReadOnlyInline}}</dt>
- <dd>A {{jsxref("Boolean")}} that is <code>true</code> if the value does not fit the rules determined by the {{htmlattrxref("step", "input")}} attribute (that is, it's not evenly divisible by the step value), or <code>false</code> if it does fit the step rule. If true, the element matches the {{cssxref(":invalid")}} and {{cssxref(":out-of-range")}} CSS pseudo-classes.</dd>
+ <dd>A {{jsxref("Boolean")}} that is <code>true</code> if the value does not fit the rules determined by the {{htmlattrxref("step", "input")}} attribute (that is, it's not evenly divisible by the step value), or <code>false</code> if it does fit the step rule. If <code>true</code>, the element matches the {{cssxref(":invalid")}} and {{cssxref(":out-of-range")}} CSS pseudo-classes.</dd>
  <dt>{{domxref("ValidityState.tooLong", "tooLong")}} {{ReadOnlyInline}}</dt>
- <dd>A {{jsxref("Boolean")}} that is <code>true</code> if the value exceeds the specified <code>maxlength</code> for {{domxref("HTMLInputElement")}} or {{domxref("HTMLTextAreaElement")}} objects, or false if its length is less than or equal to the maximum length. <em><strong>Note:</strong> This property is never <code>true</code> in Gecko, because elements' values are prevented from being longer than <code>maxlength</code>.</em> If true, the element matches the {{cssxref(":invalid")}} and {{cssxref(":out-of-range")}} CSS pseudo-classes.</dd>
+ <dd>A {{jsxref("Boolean")}} that is <code>true</code> if the value exceeds the specified <code>maxlength</code> for {{domxref("HTMLInputElement")}} or {{domxref("HTMLTextAreaElement")}} objects, or <code>false</code> if its length is less than or equal to the maximum length. <em><strong>Note:</strong> This property is never <code>true</code> in Gecko, because elements' values are prevented from being longer than <code>maxlength</code>.</em> If <code>true</code>, the element matches the {{cssxref(":invalid")}} and {{cssxref(":out-of-range")}} CSS pseudo-classes.</dd>
  <dt>{{domxref("ValidityState.tooShort", "tooShort")}} {{ReadOnlyInline}}</dt>
- <dd>A {{jsxref("Boolean")}} that is <code>true</code> if the value fails to meet the specified <code>minlength</code> for {{domxref("HTMLInputElement")}} or {{domxref("HTMLTextAreaElement")}} objects, or <code>false</code> if its length is greater than or equal to the minimum length. If true, the element matches the {{cssxref(":invalid")}} and {{cssxref(":out-of-range")}} CSS pseudo-classes.</dd>
+ <dd>A {{jsxref("Boolean")}} that is <code>true</code> if the value fails to meet the specified <code>minlength</code> for {{domxref("HTMLInputElement")}} or {{domxref("HTMLTextAreaElement")}} objects, or <code>false</code> if its length is greater than or equal to the minimum length. If <code>true</code>, the element matches the {{cssxref(":invalid")}} and {{cssxref(":out-of-range")}} CSS pseudo-classes.</dd>
  <dt>{{domxref("ValidityState.typeMismatch", "typeMismatch")}} {{ReadOnlyInline}}</dt>
- <dd>A {{jsxref("Boolean")}} that is <code>true</code> if the value is not in the required syntax (when {{htmlattrxref("type", "input")}} is <code>email</code> or <code>url</code>), or <code>false</code> if the syntax is correct. If true, the element matches the {{cssxref(":invalid")}} CSS pseudo-class.</dd>
+ <dd>A {{jsxref("Boolean")}} that is <code>true</code> if the value is not in the required syntax (when {{htmlattrxref("type", "input")}} is <code>email</code> or <code>url</code>), or <code>false</code> if the syntax is correct. If <code>true</code>, the element matches the {{cssxref(":invalid")}} CSS pseudo-class.</dd>
  <dt><code>valid</code> {{ReadOnlyInline}}</dt>
- <dd>A {{jsxref("Boolean")}} that is <code>true</code> if the element meets all its validation constraints, and is therefore considered to be valid, or <code>false</code> if it fails any constraint. If true, the element matches the {{cssxref(":valid")}} CSS pseudo-class; the {{cssxref(":invalid")}} CSS pseudo-class otherwise.</dd>
+ <dd>A {{jsxref("Boolean")}} that is <code>true</code> if the element meets all its validation constraints, and is therefore considered to be valid, or <code>false</code> if it fails any constraint. If <code>true</code>, the element matches the {{cssxref(":valid")}} CSS pseudo-class; the {{cssxref(":invalid")}} CSS pseudo-class otherwise.</dd>
  <dt>{{domxref("ValidityState.valueMissing", "valueMissing")}} {{ReadOnlyInline}}</dt>
- <dd>A {{jsxref("Boolean")}} that is <code>true</code> if the element has a {{htmlattrxref("required", "input")}} attribute, but no value, or <code>false</code> otherwise. If true, the element matches the {{cssxref(":invalid")}} CSS pseudo-class.</dd>
+ <dd>A {{jsxref("Boolean")}} that is <code>true</code> if the element has a {{htmlattrxref("required", "input")}} attribute, but no value, or <code>false</code> otherwise. If <code>true</code>, the element matches the {{cssxref(":invalid")}} CSS pseudo-class.</dd>
 </dl>
 
 <h2 id="Specifications">Specifications</h2>
 
 <table class="standard-table">
- <tbody>
+ <thead>
   <tr>
    <th scope="col">Specification</th>
    <th scope="col">Status</th>
    <th scope="col">Comment</th>
   </tr>
+ </thead>
+ <tbody>
   <tr>
    <td>{{ SpecName('HTML WHATWG', 'form-control-infrastructure.html#validitystate', 'ValidityState') }}</td>
    <td>{{Spec2('HTML WHATWG')}}</td>
@@ -76,5 +78,5 @@ <h2 id="See_also">See also</h2>
 
 <ul>
  <li><a href="/en-US/docs/Web/Guide/HTML/HTML5/Constraint_validation">Guide: Constraint validation</a></li>
- <li><a href="/en-US/docs/Learn/HTML/Forms/Form_validation">Tutorial: Form data validation</a></li>
+ <li><a href="/en-US/docs/Learn/Forms/Form_validation">Tutorial: Form data validation</a></li>
 </ul>